<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" charset="UTF-8" content="width=device-width, initial-scale=1.0">
    <title>商务合作</title>
    <script src="https://cdn.bootcss.com/babel-polyfill/7.4.4/polyfill.js"></script>
    <script src="${ctx}/js/jquery1.8.2.min.js"></script>
    <script src="${ctx}/js/vue.min.js"></script>
    <link rel="stylesheet" href="${ctx}/css/reset.css">
    <script src="${ctx}/js/changeSize.js"></script>
</head>
<style>
    [v-cloak] {
        display: none;
    }
   /*.business_box {*/
       /*position: fixed;*/
       /*top: 0;*/
       /*bottom: 0;*/
       /*left: 0;*/
       /*right: 0;*/
   /*}*/
    .head_box {
        position: relative;
        /*background: #484562;*/
        background: url('${ctx}/image/biz_image.png')no-repeat top center;
        background-size: cover;
        color: #fff;
        font-size:1rem;
        text-align: center;
        padding: 1.8rem 1rem 4rem;
    }

    .title{
        position: relative;
    }
    .go_back{
        position: absolute;
        left: 0;
        top: 50%;
        margin-top: -0.5rem;
        z-index: 5;
        display: flex;
        align-items: center;
        font-size: 0.88rem;
    }

    .go_back img{
        width: 1rem;
        height: 1rem;
        margin-right: 0.2rem;
    }

    .detail {
        margin-top: 3.5rem;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #fff;
    }
    .company {
        font-size: 1.7rem;
        padding-right: 0.5rem;
    }

    .describe {
        font-size:0.75rem;
        padding-left: 0.5rem;
        font-weight: 600;
        border-left: 1px solid #fff;
    }
    .describe p:first-child{
        color: #FAF676;
        margin-bottom: 0.2rem;
    }

    .contact {
        /*margin-top: 0.5rem;*/
        padding: 2rem 0.5rem;
        text-align: center;
        background: #fff;
    }

    .qrcode {
        width: 50%;
    }
    .img_tip {
        color: #999;
        font-size: 0.8rem;
        text-align: center;
        margin-top: 0.5rem;
    }
    .wxchat {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 1.9rem;
        margin-top: 2rem;
    }

    .wxchat img{
        width: 2rem;
    }

    .wxchat span{
        display: block;
        margin-left: 0.5rem;
        font-size: 1rem;
        font-weight: 600;
    }

    .copy_btn {
        width: 54%;
        margin: 2rem auto 0;
        line-height: 2rem;
        text-align: center;
        color: #fff;
        font-size: 0.8rem;
        background: #DF706A;
        border-radius: 1rem;
    }


    .tip{
        margin-top: 1.8rem;
        font-size: 0.63rem;
        color: #929292;
        text-align: center;
        line-height: 1.2rem;
    }
</style>
<body>
<div id="app">
    <div class="business_box"  v-cloak>
        <div class="head_box">
            <#--<div class="title" >-->
                <#--<div class="go_back" @click="comeback()">-->
                    <#--<img  src="../../static/image/left.png">-->
                <#--</div>-->
                <#--<p>商务合作</p>-->
            <#--</div>-->
            <div class="detail">
                <div class="company">乐享</div>
                <div class="describe">
                    <p>Adidear.com</p>
                    <p>ASO服务平台</p>
                </div>
            </div>
        </div>
        <div class="contact">
            <img :src="qrcode" class="qrcode" @click="saveImage">
            <p class="wxchat">
                <#--<img src="${ctx}/image/wx_logo.png">-->
                <span>{{qq}}:  {{contact}}</span>
            </p>
            <p class="copy_btn" id="copy" @click="copyCode">一键复制</p>
            <p class="tip">以上联系方式仅处理商务合作，用户问题请通过"在线客服"反馈</p>
        </div>
    </div>
</div>
</body>
</html>
<script>
    var app = new Vue({
        el: '#app',
        data: {
            contact:'',
            qrcode:''
        },

        mounted: function () {
            // window.xy_web.showAndHideTitleBar(false);
            this.getBusiness()
        },
        methods: {
            // 获取二维码微信号
            getBusiness:function(){
                var  that = this;
                $.ajax({
                    url: '/business/cooperation/data',
                    type: 'post',
                    data: {},
                    dataType: "json",
                    success: function (res) {
                        that.contact = res.wx_user?res.wx_user:'xianyunana8888';
                        that.qrcode = res.wx_url?res.wx_url:'${ctx}/image/qrcode.png';
                        that.qq = res.wx_qq?res.wx_qq:'微信';
                    },
                    error: function () {
                    }
                });
            },

            copyCode:function(){
                var that = this;
                window.xy_web.copyString(that.contact)
            },

            saveImage:function(){
                window.xy_web.downloadPic('http://hotbb.repinchen.cn/wx_kf_img.png')
            },


            // 返回上一页
            comeback: function () {
                window.xy_web.closePage();
            },
        }
    });

</script>
